<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>商品详情</title>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/page.css">
    <script src="../js/jquery-3.2.1.min.js"></script>
    <script src="../js/media.js"></script>
    <script src="../js/common.js"></script>
    <style>
        .e4s{
            margin-left: .16rem;
            padding-left: .16rem;
            background: url('../img/收藏 01@2x.png') no-repeat left;
            background-size: .14rem;
        }
        .e1s{
            padding-left: .16rem;
            background: url('../img/热度 01@2x.png') no-repeat left;
            background-size: .1rem;
        }

    </style>
</head>

<body>
<!--头部-->
<!--<div class="public-header flex">
    &lt;!&ndash;<span class="public-header-left-search"></span>&ndash;&gt;
    <span class="public-header-left-back"></span>
    <span class="public-header-center">投诉记录</span>
    <span class="public-header-right">足迹</span>
</div>-->

<!--正文-->
<div class="buy-info-page bc-gray">
    <img :src="datas.produceHeadImage" alt="图片拉取失败">
    <section class="s1">
        <p class="t1">{{datas.produceTitle}} </p>
        <p class="t2">
            <span>{{datas.produceAddTime}}</span>
            <em class="e1" v-if='datas.is_return == 1'>支持退换</em>
            <em class="e1" v-if='datas.is_return == 0'>不支持退换</em>
            <em class="e2" v-if='datas.is_free_shipping == 1'>包邮</em>
            <em class="e2" v-if='datas.is_free_shipping == 0'>不包邮</em>
            <em class="e3" v-if='datas.is_Identifiable  == 0'>不可鉴定</em>
            <em class="e3" v-if='datas.is_Identifiable  == 1'>可鉴定</em>
        </p>
        <p class="t3">
            <span @click="tsclick">投诉</span>
            <em class="e3">{{datas.produceShareNum}}</em>
            <em class="e2" v-show="iscollect" @click='add_Collection(this)'>{{produceCollectNum}}</em>
            <em class="e4s" v-show="!iscollect">{{produceCollectNum}}</em>
            <em class="e1" v-show="isdianzan" @click='add_good_2(this)' style="color:#000">{{produceGoodNum}}</em>
            <em class="e1s"v-show="!isdianzan"  style="color:#000">{{produceGoodNum}}</em>
        </p>
        <!-- <p class="t4"><span>距离结束：</span><em>2小时37分18秒</em></p> -->
    </section>
    <section class="s2 flex">
        <img :src="datas.storeImage" alt="图片拉取失败">
        <div class="right">
            <p><span>{{datas.storeName}}</span><em>VIP<strong>{{datas.storeLevel}}</strong></em>
                <i v-show="isshow" @click="cancelGz">取消关注</i>
                <i v-show="!isshow" @click="gzShop">未关注</i>
                <font v-if='datas.storeAuthority'></font>
            </p>
            <p><!--<span>联系卖家</span>--><i><font>{{datas.storeAmountGuaranteed}}</font>元</i><em> <font>{{datas.storeScore}}</font>4分</em></p>
        </div>
    </section>
    <!--最新成交-->
    <!-- <section class="s5">
        <p class="t1">
            <span class="t1-1">最新成交人</span>
            <span class="t1-2">更多</span>
        </p>
        <ul>
            <li class="flex red">

                <div class="li-1">
                    <img src="../img/头像 @3x.png" alt="">
                </div>
                <div class="li-2">
                    <p class="li-2-1">用户名</p>
                    <p class="li-2-2">￥199</p>
                </div>
                <div class="li-3">
                    <br> 17-07-03 10:31:13
                </div>
            </li>
            <li class="flex gray">

                <div class="li-1">
                    <img src="../img/头像 @3x.png" alt="">
                </div>
                <div class="li-2">
                    <p class="li-2-1">用户名</p>
                    <p class="li-2-2">￥199</p>
                </div>
                <div class="li-3">
                    <br> 17-07-03 10:31:13
                </div>
            </li>
        </ul>
        <em class="arrow-bottom"></em>
    </section> -->
    <!-- <section class="s6">

    </section>
    <section class="s3 flex">
        <div class="a1">
            <font>起</font><em>￥</em><i>0</i>
        </div>
        <div class="a2">
            <font>加</font><em>￥</em><i>0</i>
        </div>
        <div class="a3">
            <font>保</font><em>￥</em><i>0</i>
        </div>
        <div class="a4">
            <font>延</font><em>￥</em><i>0</i>
        </div>
        <div class="a5">
            <font>一口价</font><em>￥</em><i>0</i>
        </div>

    </section> -->
    <section class="s4">
        <p class=""><span>店铺产品</span>
            <!--<em>拍卖公告</em>-->
        </p>
        <div>
            <ul class="clearfix">
                <div v-if="produce.length == 0" style="text-align: center;margin-top: 100px;">
                    店铺暂无产品
                </div>
                <div v-else>
                    <li class="" v-for='item in produce'>
                        <img :src="item.produceHeadImage"  alt="图片拉取失败" @click='click_info(this)'>
                        <p class="t1">{{item.produceTitle}}</p>
                        <p class="t2"><span>￥: <font>{{item.producePrice}}</font>起</span><em @click='add_good(this)' style="color:rgba(18,18,18,0.25)">{{item.produceGoodNum}}</em></p>
                    </li>
                </div>

                <!-- <li class="">
                    <img src="../img/配图@2x.png" alt="">
                    <p class="t1">产品名字产品名字产品</p>
                    <p class="t2"><span>￥:40.00起</span><em>141</em></p>
                </li>
                <li class="">
                    <img src="../img/配图@2x.png" alt="">
                    <p class="t1">产品名字产品名字产品</p>
                    <p class="t2"><span>￥:40.00起</span><em>141</em></p>
                </li>
                <li class="">
                    <img src="../img/配图@2x.png" alt="">
                    <p class="t1">产品名字产品名字产品</p>
                    <p class="t2"><span>￥:40.00起</span><em>141</em></p>
                </li> -->
            </ul>
        </div>
    </section>
</div>


<div class="buy-footer">
    <!-- <div class="c1">
        <span>进店逛逛</span>
        <em style="background:rgba(95,49,4,1);color:#fff">立即购买</em>
    </div> -->
    <div class="c4">
        <div class="top">
            <p class="t1">
                <span style="display:inline-block;background:url('../img/起 红@2x.png') no-repeat center;background-size:contain;width:.16rem;height:.16rem;"></span>
                <em>￥: <font>{{datas.producePrice}}</font></em>
            </p>
            <!-- <p class="t2">
                <span>距离结束：</span>
                <em>2小时37分18秒</em>
            </p> -->
            <p class="t3">
                <!--    <em class="e1" @click='add_good_2(this)' style="color:#000">{{datas.produceGoodNum}}</em>
                    <em class="e2" @click='add_Collection(this)'>{{datas.produceCollectNum}}</em>
                    <em class="e3">{{datas.produceShareNum}}</em>-->




            </p>
            <p class="p4">{{datas.produceTitle}} </p>
        </div>
        <div class="bottom flex">
            <span @click='join_store(this)'>进店逛逛</span>

            <em style="background:rgba(95,49,4,1);color:#fff;flex:2;" @click='click()'>立即购买</em>
            <!--<em id="text_pay">测试支付</em>-->
        </div>
    </div>
</div>

<script src='../js/vue.js'></script>
<script src='../js/vue-resource.min.js'></script>
<script>
    $(function () {
        $(window).scroll(function () {
            if ($(window).scrollTop() > 50) {
                $('.buy-footer .c4 .top').css('display', 'none')
            } else {
                $('.buy-footer .c4 .top').css('display', 'block')
            }
        })
        var s_name = getQueryString('s_name');
        $('title').html(s_name);
        var p_id = getQueryString('p_id');

        $.ajax({
            url: base_url + 'ZITAOHUI/purchase',
            data: {
                produceId: p_id
            },
            success: function (data) {
                console.log(data)
                var title = data.extend.list[0].produceTitle;
                $('title').html(title)
            }
        });

        $('#text_pay').click(function () {
            $.ajax({
                url: base_url + 'ZITAOHUI/wexinpay',
                data: {
                    total_fee: 1,
                    user_id: u_id,
                    ip: '117.14.168.139',
                },
                success: (data) => {
                    console.log(data)
                }
            })
        })

    })
</script>
<script>
    $(function () {
        var p_id = getQueryString('p_id');
        new Vue({
            el: 'body',
            data: {
                url: base_url + 'ZITAOHUI/purchase',
                baseImg:base_url,
                storeId:'',
                userId:'',
                price:'',
                pid:'',
                datas:'',
                produce:'',
                isshow:'',
                produceGoodNum:'',
                isdianzan:1, //是否点赞
                iscollect:1
            },
            ready: function () {

                this.userId = sessionStorage.getItem("uid");
                var _self = this;
                var p_id = getQueryString('p_id');
                this.pid = p_id;

//                this.$http.get(base_url+"ZITAOHUI/store/addBrows",{
//                    params:{
//
//                    }
//                }).then(function (res){
//
//                });
                this.$http.get(this.url, {
                    params: {
                        produceId: p_id,
                        userId:_self.userId
                    }
                }).then(
                    function (response) {
                        var all_data = response.data.extend.list;
                        var produce_info = response.data.extend.list2;
                        var guanzhu = response.data.extend.list3;
                        var time = all_data[0].produceAddTime;
                        _self.produceGoodNum = all_data[0].produceGoodNum;
                        _self.produceCollectNum = all_data[0].produceCollectNum;
                        var all_time = new Date(time);
                        var product_time = all_time.getMonth() + '月' + all_time.getDate() +
                            '日 ' + all_time.getHours() + ':' + all_time.getMinutes();
                        all_data[0].produceAddTime = product_time;
                        console.log(product_time)
                        this.$set('datas', all_data[0]);
//                            this.$set('produce', produce_info.slice(0, 4));
                        this.$set('produce', produce_info);
                        this.storeId = all_data[0].storeId;
                        this.price = all_data[0].producePrice;
                        console.log(response.data.extend);
                        if(guanzhu == 0){
                            _self.isshow = 0;
                        }else{
                            _self.isshow = 1;
                        }
                    },
                    function (response) {}
                )
            },
            methods: {
                tsclick:function (){
                    //投诉点击下一页
                    var _self = this;
                    window.location.href = "Complaints.html?pid="+_self.pid;
                },
                click: function () {
                    /**
                     * 点击立即购买
                     * **/
                    var _self = this;
                    this.$http.get(base_url+"ZITAOHUI/isShield",{
                        params:{
                            storeId: _self.storeId,
                            userId:_self.userId
                        }
                    }).then(function (res){
                        console.log(res);
                        if(res.data.code == 1){
                            window.location.href = '../page/my-address.html?uid='+_self.userId+'&produceid='+_self.pid+'&price='+_self.price+"&storeId="+_self.storeId+"&orderType=2";
                        }else{
                            alert("该用户已被屏蔽");
                        }
                    });
                },
                gzShop:function (){
                    var _self = this;
                    this.$http.get(base_url+"ZITAOHUI/user/addFans",{
                        params:{
                            uid:_self.userId,
                            storeid:_self.storeId
                        }
                    }).then(function (res){
                        console.log(res);
                        if(res.body.code == 1){
                            alert("关注成功");
                            _self.isshow = 1;
                        }else{
                            alert("关注失败");
                            _self.isshow = 0;
                        }
                    })
                },
                cancelGz:function (){
                    //取消关注
                    var _self = this;
                    this.$http.get(base_url+"ZITAOHUI/focus/cancel",{
                        params:{
                            uid:_self.userId,
                            storeid:_self.storeId
                        }
                    }).then(function (res){
                        console.log(res);
                        if(res.body.code == 1){
                            alert("取消关注成功")
                            _self.isshow = 0;

                        }else{
                            alert("关注失败");
                            _self.isshow = 1;
                        }
                    })
                },
                click_info: function (t) {
                    console.log(t)
                    window.location.href = '../page/buy-info-page.3.html?p_id=' + t.item.produceId
                },

                add_good: function (t) {
                    console.log(t);
                    var _self = this;
                    this.$http.get(base_url + 'ZITAOHUI/goodNum', {
                        params: {
                            produceId: t.item.produceId,
                            user_id: _self.userId
                        }
                    }).then(
                        function (data) {
                            var  sun = data.data.extend;
                            sun = sun.haha.list;
                            if (sun == 1) {
                                _self.produceGoodNum += 1;
                                _self.iscollect = 0;
                            } else if (sun == 2) {
                                alert('网络不好，请稍后再试')
                                _self.iscollect = 1;
                            } else {
                                alert('您已经对该商品点过赞啦');
                                _self.iscollect = 1;
                            }
                        }
                    )
                },

                add_good_2: function (t) {
                    console.log(t)
                    var _self = this;
                    this.$http.get(base_url + 'ZITAOHUI/goodNum', {
                        params: {
                            produceId: p_id,
                            user_id: _self.userId
                        }
                    }).then(
                        function (data) {
                            console.log(data)
                            var sun = data.data.extend;
                            sun = sun.haha.list;
                            if (sun == 1) {
//                                     t.item.produceGoodNum += 1;
                                _self.produceGoodNum += 1;
                                _self.isdianzan = 0;
                                console.log(_self.isdianzan);
                            } else if (sun == 2) {
                                alert('网络不好，请稍后再试')
                                _self.isdianzan = 1;
                            } else {
                                alert('您已经对该商品点过赞啦')
                            }
                        }
                    )
                },
                // 添加收藏
                add_Collection: function (t) {
                    console.log(t)
                    var _self = this;
                    this.$http.get(base_url + 'ZITAOHUI/conllectionNum', {
                        params: {
                            produceId: p_id,
                            user_id: _self.userId
                        }
                    }).then(
                        function (data) {
                            console.log(data)
                            var sun = data.data.extend;
                            sun = sun.list.conllection;
                            if (sun == 1) {
                                _self.produceCollectNum +=1;
                                _self.iscollect = 0;
                            } else if (sun == 2) {
                                alert('网络不好，请稍后再试')
                                _self.iscollect = 1;
                            } else {
                                alert('您已经对该商品点过收藏啦')
                            }
                        }
                    )
                },
                join_store: function (t) {
                    console.log(t)
                    window.location.href = "../page/Shop.html?s_id=" + t.datas.storeId
                },

            }
        })
    })
</script>



</body>

</html>